<template>
  <div>

    <input type="text" v-model="obj.msg">
  </div>
</template>

<script>
export default {
  data() {
    return {
      obj: {
        msg: '李唯一受害了'
      }
    }
  },
  computed: {
    obj1() {
      return JSON.parse(JSON.stringify(this.obj))
    }
  },
  watch: {
    // 监听对象的某一个属性
    /*
    'obj.msg'(newVal, oldVal) {
      console.log(newVal, oldVal);
    }
      */
    // 监听整个对象
    // 新旧属性一样 用计算属性拷贝一下 去监听计算属性
    obj1: {
      handler(newVal, oldVal) {
        console.log(newVal.msg, '新数据');
        // 初始化监听没有旧数据 会报错 要先判断一下
        if (oldVal) {
          console.log(oldVal, '旧数据')
        }
      },
      // 深度监听
      deep: true,
      // 初始化监听
      immediate: true
    }
  }
}
</script>

<style></style>